<template>
  <div>
    <el-table
      v-loading="loading"
      :data="checkList"
      border
      style="width: 60%;"
    >
      <el-table-column label="项目名称" align="center" prop="projectName" width="150" :show-overflow-tooltip="true"/>
      <el-table-column label="12s" align="center" prop="rule1" :show-overflow-tooltip="true"/>
      <el-table-column label="13s" align="center" prop="rule2" :show-overflow-tooltip="true"/>
      <el-table-column label="22s" align="center" prop="rule3" :show-overflow-tooltip="true"/>
      <el-table-column label="R4s" align="center" prop="rule4" :show-overflow-tooltip="true"/>
      <el-table-column label="41s" align="center" prop="rule5" :show-overflow-tooltip="true"/>
      <el-table-column label="10x" align="center" prop="rule6" :show-overflow-tooltip="true"/>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="pageNum" :limit.sync="pageSize" />
  </div>
</template>

<script>

export default {
  name: 'setRules',
  props: {
    user: {
      type: Object
    }
  },
  data() {
    return {
      checkList: [],
      loading: false,
      total: 2,
      pageNum: 1,
      pageSize: 20
    };
  },
  created() {
    this.handleLoadAndQuery()
  },
  methods: {
    handleLoadAndQuery() {
      this.checkList = [{
        projectName: 'CRP',
        rule1: '警告',
        rule2: '失控',
        rule3: '失控',
        rule4: '失控',
        rule5: '失控',
        rule6: '失控'
      },{
        projectName: 'SAA',
        rule1: '不启用',
        rule2: '不启用',
        rule3: '不启用',
        rule4: '不启用',
        rule5: '不启用',
        rule6: '不启用'
      }]
    }
  }
};
</script>
